<!--//项目信息-->
<template>
  <div style="margin-top: 10px">
    <div>
      <div>
        <el-row>
          <el-col :span="18">
            <el-button-group>
              <el-button type="primary" size="small">查看</el-button>
              <el-button
                type="primary"
                size="small"
                v-if="activeName == '待审核'"
                >通过</el-button
              >
              <el-button
                type="primary"
                size="small"
                v-if="activeName == '待审核'"
                >不通过</el-button
              >
              <el-button type="primary" size="small">修改</el-button>
              <el-button type="primary" size="small">删除</el-button>
              <el-button type="primary" size="small">新增</el-button>
            </el-button-group>
          </el-col>
          <el-col :span="6" :offset="2">
            <!-- <el-col :span="20"> -->
              <!-- <el-input
                v-model="proValue"
                placeholder="请填写项目名称"
                size="small"
                clearable
                style="height: 40px"
              >
              </el-input>
            </el-col>
            <el-col :span="2">
              <el-button
                icon="el-icon-search"
                type="primary"
                size="small"
                @click="search"
              ></el-button> -->
              <inputSelect>
              <el-input
                 slot='header'
                v-model="proValue"
                placeholder="请填写项目名称"
                size="small"
                clearable
                style="height: 40px;width:100%"
              >
              </el-input>
              <el-input
                 slot='body'
                v-model="proValue"
                placeholder="请填写项目名称"
                size="small"
                clearable
                style="height: 40px"
              >
              </el-input>
              </inputSelect>
            <!-- </el-col> -->
          </el-col>
        </el-row>
      </div>
    </div>
    <tabTable :tabList="tabList" @func="functab" :activeName="activeName">
      <el-table
        max-height="50%"
        ref="multipleTable"
        @selection-change="handleSelectionChange"
        :data="tableData"
        style="width: 100%"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column prop="date" label="项目名称" width="180">
        </el-table-column>
        <el-table-column prop="name" label="项目技术栈" width="180">
        </el-table-column>
        <el-table-column prop="address" label="公司名称" width="180">
        </el-table-column>
        <el-table-column prop="address" label="项目状态" width="180">
        </el-table-column>
        <el-table-column prop="" label="项目图片" width="180">
        </el-table-column>
        <el-table-column prop="address" label="项目内容" width="180">
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage3"
          :page-size="100"
          :hide-on-single-page="value"
          layout="prev, pager, next, jumper"
          :total="4"
        >
        </el-pagination>
      </div>
    </tabTable>
  </div>
</template>

<script>
import tabTable from "@/components/tab-table/tab-table";
import inputSelect from '@/components/input-select'
export default {
  name: "project-massage",
  components: { tabTable,inputSelect },
  data() {
    return {
      activeName: "待审核",
      proValue: "",
      tableData: [
        {
          date: "2016-05-02",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1518 弄",
        },
        {
          date: "2016-05-04",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1517 弄",
        },
        {
          date: "2016-05-01",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1519 弄",
        },
        {
          date: "2016-05-03",
          name: "王小虎",
          address: "上海市普陀区金沙江路 1516 弄",
        },
      ],
      currentPage3: 2,
      value: false,
      tabList: [
        { label: "待审核" },
        { label: "未通过" },
        { label: "发布中" },
        { label: "待提交" },
        { label: "待付款" },
        { label: "已完结" },
      ],
    };
  },
  methods: {
    handleSelectionChange() {},
    functab(data) {
      console.log(data);
      this.activeName = data;
    },
    search() {
      console.log(999);
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
  },
};
</script>

<style lang="less" scoped>
/deep/ .el-pagination {
  text-align: right;
}
</style>
